import React from 'react';
import { Accordion, List } from 'antd-mobile';


const Grade = (props) => {
    console.log(props)
    let {grades} =props.grades
    return (
        <ul>
            {
            grades.map((item, i) => {
                return (
                    <li key={item.id}>
                        <Accordion  className="my-accordion" onChange={(v) => console.log(v)}>
                                <Accordion.Panel header={ <span className='yo-ico'>&#xe608;{item.name}</span>}>
                                <List className="my-list" >
                                    {
                                        item.subjects.map( (v,index)=>{
                                            return(
                                            <List.Item key={index}>{v.name}
                                                <input type="checkbox"/>
                                            </List.Item>
                                            )
                                        })
                                    }
                                </List>
                            </Accordion.Panel>
                        </Accordion>
                    </li>
                )
            })
            }
        </ul>
    )
}

export default Grade;

